/**
 * 组件 - 数量选择Sheet
 * quantitySheet.less
 * -----------------------------------
 * 18/05/30 Jerry 新增
 */

@import '../quantitySpinner/quantitySpinner.less';

/* 数量选择器-遮罩层 */
.quantity-mask {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 100rpx;
  background-color: @color-text;

  opacity: .4;
  z-index: 998;
}

/* 数量选择器-浮动层 */
.quantity-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 100rpx;
  padding: @block-padding-left;
  box-sizing: border-box;
  background: @color-white;
  z-index: 999;

  .sku-inf {
    overflow: hidden;
    border-bottom: @border-gray;

    .sku-box {
      .flex-start;
      height: 150rpx;
      margin-bottom: 20rpx;

      /* SKU小图 */
      .sku-img {
        .ico-sku;
      }

      .sku-text {
        padding: 0 15rpx;
        background-color: transparent;

        view {

          &:last-child {
            font-size: @text-size-m5;
          }

        } /* view */

      } /* .sku-text */
    }

  } /* .sku-inf */

  /* sku-spec */
  .sku-prices {
    .clear-after;
    padding:30rpx 0;
    border-bottom: @border-gray-light;

    .price-item {
      float: left;
      margin: 0 15rpx;

      /* 单价着重显示 */
      .price-val {
        color: @color-primary;
        font-size: @text-size-l;
      }

      .price-qty {
        .flex-center;
        font-size: @text-size-s3;
      }

    } /* .price-item */

  }/* sku-prices */

  /* SKU属性项 */
  .sku-prop {
    padding: 30rpx 0;
    border-bottom: @border-gray-light;

    label {
      margin-left: 15rpx;
      line-height: 65rpx;
    }

    /* 规格分组 */
    &.sku-group {

      view {
        float: right;

        text {
          display: inline-block;
          margin: 0 15rpx;
          padding: 10rpx 30rpx;
          border-radius: 5rpx;
          border: @border-gray;

          /* 分组规格的选中样式 */
          &.sel {
            color: @color-primary;
            border-color: @color-primary;
            background-color: fade(@color-primary, 10%);
          } /* &.sel */

        } /* text */

      } /* view */

    } /* .sku-group */

    /* SKU数量 */
    &.sku-quantity {
      border-bottom: none;

      .quantity-spinner {
        float: right;
      }

    } /* .sku-quantity */

  } /* .sku-prop */

  /* 右上角取消按钮 */
  .op-cancel {
    position: absolute;
    top: 0;
    right: 0;
    padding: 30rpx;
    .ico-m;
    .opacity-gray;
  }

} /* .quantity-sheet */